import QtQuick

/*
  自定义组件：仅带有标题和帮助按键和关闭按键的标题栏
  依赖的自定义组件：ImageBtn.qml
*/
Rectangle {
    id: customHeaderBar
    width: 100
    height: 34
    color: "#24292e"
    z: 1

    signal closePageBtnClicked()
    signal winPositionChanged(var x, var y)

    property string chbTitleText: qsTr("title") // 标题文本
    property color chbTitleColor: "#e1e4e8" // 标题文本颜色
    property int chbTitleFontSize: 15 // 标题字体大小

    property var chbHelpText: qsTr("暂无帮助信息，请留言作者咨询，2493269901@qq.com")

    // 帮助信息浮现页面
    Rectangle {
        id: helpRect
        anchors.top: helpPageBtn.bottom
        anchors.right: parent.right
        width: helpText.width + 10
        height: helpText.height + 10
        opacity: 0
        color: "#1f2428"
        radius: 8
        z: 2

        Behavior on opacity {
            NumberAnimation {
                duration: 400
            }
        }

        AsText {
            id: helpText
            x: 5
            y: 5
            text: chbHelpText
            color: chbTitleColor
            font.pixelSize: 13
        }
    }
    // 标题区
    MouseArea {
        id: centerSide
        width: parent.width - helpPageBtn.width - closePageBtn.width
        height: parent.height
        anchors.left: parent.left
        acceptedButtons: Qt.LeftButton

        property point clickPos: "0,0"

        onPressed: {
            focus = true
            clickPos  = Qt.point(mouseX,mouseY)
        }

        onPositionChanged: {
            var delta = Qt.point(mouseX-clickPos.x, mouseY-clickPos.y)
            winPositionChanged(delta.x, delta.y)
        }

        AsText {
            id: titleText
            x: (customHeaderBar.width - width) / 2
            height: parent.height
            text: chbTitleText
            color: chbTitleColor
            font.pixelSize: chbTitleFontSize
            horizontalAlignment: Text.AlignHCenter
            verticalAlignment: Text.AlignVCenter
        }
    }
    // 帮助按键
    ImageBtn {
        id: helpPageBtn
        anchors.right: closePageBtn.left
        width: 50
        height: parent.height
        ibUrl: "qrc:/imgs/help.png"
        ibBackColor: customHeaderBar.color
        ibImgMarginWidth: 14
        ibImgMarginHeight: 5
        ibHoverColor: "#4F4F4F"

        onEntered: {
            helpRect.opacity = 1
        }

        onExited: {
            helpRect.opacity = 0
        }
    }
    // 关闭按键
    ImageBtn {
        id: closePageBtn
        anchors.right: parent.right
        width: 50
        height: parent.height
        ibUrl: "qrc:/imgs/close.png"
        ibBackColor: customHeaderBar.color
        ibImgMarginWidth: 16
        ibImgMarginHeight: 8
        ibHoverColor: "#FE1D00"

        onClicked: {
            closePageBtnClicked()
        }
    }

}
